<template>
  <div class="box">
    <x-form
      ref="myForm"
      :disabled="false"
      :guter="20"
      v-model:formValue="formInfo"
    >
      <template #ceshi_slot> 我是插槽{{ formInfo.ceshi_slot }} </template>
    </x-form>
    <a-button @click="getForm">获取form表单</a-button>
    <a-button @click="setForm">修改form表单</a-button>
  </div>
</template>
<script setup lang="ts">
import { ref, reactive, onMounted } from "vue";
import dayjs from "dayjs";
const myForm = ref();
const formInfo = ref<any>({});
const getForm = async () => {
  //   console.log(formInfo.value);
  const flag = await myForm.value.checkField();
  console.log(formInfo);
  console.log(flag);
};
const setForm = () => {
  formInfo.value.ceshi_slot = "发了啥打法";
  formInfo.value.image = ["https://workyd.com/image/source_plant/avatar.png"];
};
onMounted(() => {
  setTimeout(() => {
    formInfo.value = {
      name: "fhadslfa ",
      createTime: "2019-09-08",
      timeRange: ["2019-09-08", "2019-09-11"],
      image: ["https://workyd.com/image/source_plant/avatar.png"],
    };
  }, 2000);
});
</script>
<style lang="scss" scoped>
.box {
  color: #60d659;
}
</style>
